import type { FC, PropsWithChildren } from 'react'
import classNames from 'classnames'
import styles from './index.module.scss'

interface IndexProps {
  value: boolean
  checkedValue?: string | number
  onChange?: (v: boolean) => void
}

const Index: FC<PropsWithChildren<IndexProps>> = ({ children, value, ...props }) => {
  return (<label className={styles.CheckboxWraper} >
    <span className={classNames(styles.Checkbox, { [styles.checked]: value })}>
      <input type="checkbox" checked={value || false} onChange={(e) => {
        props.onChange?.(e.target.checked)
      }} />
      <span className={styles.inner}></span>
    </span>
    <span>{children}</span>
  </label>)
}

export default Index
